<!DOCTYPE html>
<html>
<head>
    {include file="layout:_meta_index" /}
</head>
<body>

<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <input type="text" name="name" placeholder="请输入分组名" autocomplete="off" class="layui-input">
                </div>
                <div class="layui-inline">
                    <input type="text" name="title" placeholder="请输入分组标题" autocomplete="off" class="layui-input">
                </div>
                <div class="layui-inline">
                    <button class="layui-btn layuiadmin-btn-admin" lay-submit lay-filter="listSearch">
                        <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                    </button>
                </div>
            </div>
        </div>

        <div class="layui-card-body">
            <script type="text/html" id="listTableToolbar">
                <div class="layui-btn-container">
                    <button class="layui-btn layui-btn-sm" lay-event="add">添加分组</button>
                    <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="del">删除分组</button>
                </div>
            </script>
            <script type="text/html" id="buttonTpl">
                {{#  if(d.system == 1){ }}
                <button class="layui-btn layui-btn-xs" lay-event="show">已加入</button>
                {{#  } else { }}
                <button class="layui-btn layui-btn-primary layui-btn-xs" lay-event="show">未加入</button>
                {{#  } }}
            </script>
            <table id="listTable" lay-filter="listTable"></table>

            <script type="text/html" id="listTableBar">
                <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
                {{#  if(d.name =='site'){ }}
                <a class="layui-btn layui-btn-disabled layui-btn-xs"><i class="layui-icon layui-icon-delete"></i>删除</a>
                {{#  } else { }}
                <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
                {{#  } }}
            </script>
        </div>
    </div>
</div>
{include file="layout:_footer" /}
<script>
    var del_url = '{:url("config/remove_group")}';
    var add_url = '{:url("config/edit_group")}';
    layui.config({
        base: '__static__/admin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'form', 'table','common'], function(){
        var $ = layui.$
            ,common = layui.common
            ,form = layui.form
            ,table = layui.table;

        //数据列表
        table.render({
            elem: '#listTable',
            url : "{:url('config/group')}",
            toolbar: '#listTableToolbar',
            cols : [[
                {type: 'checkbox'},
                {field: 'id', title: 'ID', align:"center"},
                {field: 'name', title: '分组名', align:'center'},
                {field: 'title', title: '分组标题', align:'center'},
                {field: 'system', title: '加入系统设置', align:'center',templet: '#buttonTpl'},
                {title: '操作', fixed:"right",align:"center",templet:'#listTableBar'}
            ]],
            page: true, //是否显示分页
            limits:[10,15,20,25,30],//显示
            limit: 15 //每页默认显示的数量
            ,height: document.documentElement.clientHeight/5*4
        });

        //监听搜索
        common.tableSearch('listSearch','listTable');

        //列表操作
        table.on('tool(listTable)', function(obj){
            var layEvent = obj.event, data = obj.data;
            if(layEvent === 'del'){ //删除
                common.tableDelete(del_url,data.id,'listTable');
            }else if (layEvent==='edit'){
                common.adminShow(add_url+'?id='+data.id,"编辑配置分组",'400','300','addEdit','listTable');
            }
        });

        //列表工具栏操作
        table.on('toolbar(listTable)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'del':common.tableDelete(del_url,checkStatus.data,'listTable');break;
                case 'add':common.adminShow(add_url,"添加配置分组",'400','260','addEdit','listTable');break;
            }
        });


    });
</script>
</body>
</html>

